Motion >> Repos - motion-next.git/blob

   1 <div
   2   id="mailAccounts"
   3   class="page-layout simple left-sidenav inner-sidenav motion-list"
   4 >
   5   <!-- HEADER -->
   6   <div
   7     class="header md-accent-bg"
   8     layout="row"
   9     layout-align="space-between center"
  10   >
  11     <!-- APP TITLE -->
  12     <div layout="row" layout-align="start center">
  13       <div class="logo" layout="row" layout-align="start center">
  14         <span class="logo-icon">
  15           <md-icon md-font-icon="icon-email" class="s24"></md-icon>
  16         </span>
  17         <span class="logo-text" translate="MAIL.MAILACCOUNTS"
  18           >MailAccounts</span
  19         >
  20       </div>
  21     </div>
  22     <!-- / APP TITLE -->
  23
  24     <div layout="row">
  25       <!-- SEARCH -->
  26       <div
  27         class="search-input-wrapper"
  28         layout="row"
  29         layout-align="start center"
  30       >
  31         <label for="search">
  32           <md-icon md-font-icon="icon-magnify"></md-icon>
  33         </label>
  34         <md-input-container md-no-float class="m-0">
  35           <input
  36             id="search"
  37             placeholder="Search for anyone"
  38             type="text"
  39             ng-model="vm.query.filter"
  40             ng-model-options="{ debounce: 1000 }"
  41             translate
  42             translate-attr-placeholder="MAIL.SEARCH_FOR_ANYONE"
  43           />
  44         </md-input-container>
  45       </div>
  46       <!-- / SEARCH -->
  47     </div>
  48   </div>
  49   <!-- / HEADER -->
  50
  51   <!-- SELECTED BAR -->
  52   <div
  53     ng-show="vm.selectedMailAccounts.length > 0"
  54     class="selected-bar header animate-slide-down md-accent-bg"
  55     layout="row"
  56     layout-align="start center"
  57   >
  58     <div class="close-button-wrapper" ng-click="vm.selectedMailAccounts =[]">
  59       <md-button layout="row" layout-align="start center">
  60         <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
  61         <span translate="MAIL.BACK">Back</span>
  62       </md-button>
  63     </div>
  64
  65     <div flex layout="row" layout-align="space-between center">
  66       <div>
  67         <span class="selected-mailAccounts-count">
  68           <span>{{vm.selectedMailAccounts.length}}</span>
  69           <span translate="MAIL.SELECTED">selected</span>
  70         </span>
  71
  72         <md-menu class="select-menu" ng-if="!vm.currentThread">
  73           <md-button
  74             class="md-icon-button"
  75             ng-click="$mdMenu.open($event)"
  76             aria-label="multi select toggle"
  77             translate
  78             translate-attr-aria-label="MAIL.MULTI_SELECT_TOGGLE"
  79           >
  80             <md-icon md-font-icon="icon-menu-down"></md-icon>
  81           </md-button>
  82           <md-menu-content width="3">
  83             <md-menu-item>
  84               <md-button
  85                 ng-click="vm.selectAllMailAccounts()"
  86                 translate="MAIL.SELECT_ALL"
  87               >
  88                 Select all
  89               </md-button>
  90             </md-menu-item>
  91             <md-menu-item>
  92               <md-button
  93                 ng-click="vm.deselectMailAccounts()"
  94                 translate="MAIL.SELECT_NONE"
  95               >
  96                 Select none
  97               </md-button>
  98             </md-menu-item>
  99           </md-menu-content>
 100         </md-menu>
 101       </div>
 102
 103       <div class="multi-select-actions">
 104         <button
 105           class="md-icon-button"
 106           ng-csv="vm.exportSelectedMailAccounts"
 107           csv-label="true"
 108           filename="mailAccounts.csv"
 109         >
 110           <md-icon md-font-icon="icon-file-excel"></md-icon>
 111         </button>
 112         <md-button
 113           class="md-icon-button"
 114           ng-if="vm.crudPermissions.canDelete"
 115           ng-click="vm.deleteSelectedMailAccounts($event)"
 116           aria-label="delete selected"
 117           translate
 118           translate-attr-label="MAIL.DELETE_SELECTED"
 119         >
 120           <md-icon md-font-icon="icon-delete"></md-icon>
 121         </md-button>
 122       </div>
 123     </div>
 124   </div>
 125   <!-- / SELECTED BAR -->
 126
 127   <!-- CONTENT -->
 128   <div class="content" md-background-bg layout="row" layout-align="start start">
 129     <!-- MAIN -->
 130     <div class="main scrollable" ms-scroll>
 131       <!-- MAILACCOUNT TABLE -->
 132       <md-card>
 133         <md-table-container>
 134           <table
 135             md-table
 136             md-row-select
 137             multiple
 138             ng-model="vm.selectedMailAccounts"
 139             md-progress="vm.promise"
 140           >
 141             <thead
 142               md-head
 143               md-order="vm.query.sort"
 144               md-on-reorder="vm.getMailAccounts"
 145             >
 146               <tr md-row>
 147                 <th
 148                   md-column
 149                   ng-if="vm.table == 'users' || vm.table == 'agents'"
 150                   width="20px"
 151                 ></th>
 152                 <th md-column md-order-by="id">{{ 'MAIL.ID' | translate }}</th>
 153                 <th md-column md-order-by="name">
 154                   {{ 'MAIL.NAME' | translate }}
 155                 </th>
 156                 <th md-column md-order-by="key">
 157                   {{ 'MAIL.KEY' | translate }}
 158                 </th>
 159                 <th md-column md-order-by="email">
 160                   {{ 'MAIL.EMAIL_ADDRESS' | translate }}
 161                 </th>
 162                 <th md-column md-order-by="active">
 163                   {{ 'MAIL.ACTIVE' | translate }}
 164                 </th>
 165                 <th md-column md-order-by="description">
 166                   {{ 'MAIL.DESCRIPTION' | translate }}
 167                 </th>
 168                 <th md-column width="10px"></th>
 169               </tr>
 170             </thead>
 171             <tbody md-body>
 172               <tr md-row ng-hide="vm.mailAccounts.rows.length">
 173                 <td md-cell colspan="7">
 174                   <div layout="row" layout-align="center center">
 175                     <span translate="MAIL.NO_AVAILABLE_INFO"
 176                       >No Available Info</span
 177                     >
 178                   </div>
 179                 </td>
 180               </tr>
 181               <tr
 182                 md-row
 183                 md-select="mailAccount"
 184                 md-select-id="id"
 185                 ng-repeat="mailAccount in vm.mailAccounts.rows"
 186               >
 187                 <td md-cell ng-if="mailAccount.userpic">
 188                   <img
 189                     class="avatar"
 190                     alt="{{mailAccount.name}}"
 191                     ng-src="api/users/{{mailAccount.id}}/avatar"
 192                   />
 193                 </td>
 194                 <td
 195                   md-cell
 196                   ng-if="!mailAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
 197                 >
 198                   <img
 199                     class="avatar"
 200                     alt="{{mailAccount.name}}"
 201                     ng-src="assets/images/avatars/profile.png"
 202                   />
 203                 </td>
 204                 <td
 205                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
 206                   md-cell
 207                   class="id"
 208                 >
 209                   {{mailAccount.id}}
 210                 </td>
 211                 <td
 212                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
 213                   md-cell
 214                   class="name"
 215                 >
 216                   {{mailAccount.name}}
 217                 </td>
 218                 <td
 219                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
 220                   md-cell
 221                   class="key"
 222                 >
 223                   {{mailAccount.key}}
 224                 </td>
 225                 <td
 226                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
 227                   md-cell
 228                   class="email"
 229                 >
 230                   {{mailAccount.email}}
 231                 </td>
 232                 <td
 233                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
 234                   md-cell
 235                   class="active"
 236                 >
 237                   <md-icon
 238                     md-colors="{color: {{mailAccount.active ? '\'green\'' : '\'grey\''}}}"
 239                     md-font-icon="{{mailAccount.active ? 'icon-check' : 'icon-close'}}"
 240                   ></md-icon>
 241                 </td>
 242                 <td
 243                   ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
 244                   md-cell
 245                   class="description"
 246                 >
 247                   {{mailAccount.description}}
 248                 </td>
 249
 250                 <td md-cell class="actions">
 251                   <md-menu>
 252                     <md-button
 253                       class="md-icon-button"
 254                       aria-label="More"
 255                       translate
 256                       translate-attr-aria-label="MAIL.MORE"
 257                       ng-click="$mdMenu.open($event)"
 258                     >
 259                       <md-icon md-font-icon="icon-dots-vertical"></md-icon>
 260                     </md-button>
 261
 262                     <md-menu-content width="3">
 263                       <!-- SUBACTIONS -->
 264
 265                       <!-- ACTIONS -->
 266
 267                       <md-menu-item ng-if="vm.crudPermissions.canEdit">
 268                         <md-button
 269                           ng-click="vm.editstate(mailAccount, $event    )"
 270                           translate="MAIL.EDIT_MAILACCOUNT"
 271                         >
 272                           Edit MailAccount
 273                         </md-button>
 274                       </md-menu-item>
 275
 276                       <!-- SUBACTIONS -->
 277
 278                       <!-- ACTIONS -->
 279
 280                       <md-menu-item>
 281                         <md-button
 282                           ng-click="vm.verifysmtpverifysmtp(mailAccount, $event    )"
 283                           translate="MAIL.VERIFYSMTP_MAILACCOUNT"
 284                         >
 285                           verifysmtp MailAccount
 286                         </md-button>
 287                       </md-menu-item>
 288
 289                       <!-- SUBACTIONS -->
 290
 291                       <!-- ACTIONS -->
 292
 293                       <md-menu-item>
 294                         <md-button
 295                           ng-click="vm.interactionsgoto(mailAccount, $event    )"
 296                           translate="MAIL.INTERACTIONS_MAILACCOUNT"
 297                         >
 298                           Interactions MailAccount
 299                         </md-button>
 300                       </md-menu-item>
 301
 302                       <!-- SUBACTIONS -->
 303
 304                       <!-- ACTIONS -->
 305
 306                       <md-menu-item>
 307                         <md-button
 308                           ng-click="vm.gotorealtimegoto(mailAccount, $event    )"
 309                           translate="MAIL.GOTOREALTIME_MAILACCOUNT"
 310                         >
 311                           goToRealtime MailAccount
 312                         </md-button>
 313                       </md-menu-item>
 314
 315                       <!-- SUBACTIONS -->
 316
 317                       <!-- ACTIONS -->
 318
 319                       <md-menu-item>
 320                         <md-button
 321                           ng-click="vm.agentadddialog(mailAccount, $event    )"
 322                           translate="MAIL.AGENTADD_MAILACCOUNT"
 323                         >
 324                           AgentAdd MailAccount
 325                         </md-button>
 326                       </md-menu-item>
 327
 328                       <!-- SUBACTIONS -->
 329
 330                       <!-- ACTIONS -->
 331
 332                       <md-menu-item ng-if="vm.crudPermissions.canDelete">
 333                         <md-button
 334                           ng-click="vm.deleteconfirm(mailAccount, $event    )"
 335                           translate="MAIL.DELETE_MAILACCOUNT"
 336                         >
 337                           Delete MailAccount
 338                         </md-button>
 339                       </md-menu-item>
 340                     </md-menu-content>
 341                   </md-menu>
 342                 </td>
 343               </tr>
 344             </tbody>
 345           </table>
 346         </md-table-container>
 347
 348         <md-table-pagination
 349           md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
 350           md-limit="vm.query.limit"
 351           md-limit-options="[10, 15, 20, 50, 100, 250]"
 352           md-page="vm.query.page"
 353           md-total="{{vm.mailAccounts.count}}"
 354           md-on-paginate="vm.getMailAccounts"
 355           md-page-select
 356         ></md-table-pagination>
 357       </md-card>
 358       <!-- / MAILACCOUNT TABLE -->
 359       <!-- NO RESULTS -->
 360
 361       <!-- / NO RESULTS -->
 362     </div>
 363     <!-- / MAIN -->
 364   </div>
 365   <!-- / CONTENT -->
 366
 367   <!-- ADD MAILACCOUNT BUTTON -->
 368   <md-button
 369     ng-if="vm.crudPermissions.canEdit"
 370     class="md-fab md-accent add-item-button"
 371     id="add-mailAccount-button"
 372     ng-click="vm.createOrEditMailAccount($event)"
 373     aria-label="add mailAccount"
 374     translate
 375     translate-attr-aria-label="MAIL.ADD_MAILACCOUNT"
 376   >
 377     <md-icon md-font-icon="icon-plus"></md-icon>
 378   </md-button>
 379   <!-- / ADD MAILACCOUNT BUTTON -->
 380 </div>